<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>内嵌框架</title>
    <style type="text/css">
        .menu{
            width: 600px;
            height: 50px;
            list-style: none;
            margin:30px auto;
            font-size: 0;
        }
        .menu li{
            width: 140px;
            height: 46px;
            display: inline-block;
            border: 2px solid gold;
            text-align: center;
            line-height: 46px;
            font-size: 16px;
            background-color: blue;
        }
        .menu li a{
            color: gold;
            text-decoration: none;
        }
        .menu li:hover{
            background-color: orange;
        }
        .menu li a:hover{
            color: red;
        }
    </style>
</head>
<body>
    <ul class="menu">
        <li><a href="http://www.baidu.com" target="myframe">百度网</a></li>
        <li><a href="http://www.qq.com" target="myframe">腾讯网</a></li>
        <li><a href="https://www.taobao.com" target="myframe">淘宝网</a></li>
        <li><a href="https://www.sina.com.cn/" target="myframe">新浪网</a></li>
    </ul>
    <iframe src="http://www.baidu.com" width="100%" height="500" name="myframe"></iframe>
    <hr>
    <h3>01 常用标签.html</h3>
    <iframe src="01_html常用标签.html" width="100%" height="500" frameborder="0" scrolling="no"></iframe>
    <hr>
    <h3>02 html列表.html</h3>
    <iframe src="02_html列表.html" width="100%" height="500" frameborder="0" scrolling="no"></iframe>
    <hr>
    <h3>03 html表格.html</h3>
    <iframe src="03_html表格.html" width="100%" height="500" frameborder="0" scrolling="no"></iframe>
    <hr>
    <h3>04 html表单.html</h3>
    <iframe src="04_html表单.html" width="100%" height="500" frameborder="0" scrolling="no"></iframe>
</body>
</html>